<html>
<head>
<title>Card</title>
</head>
<body>
<script type="text/javascript" src="http://code.google.com/apis/gears/gears_init.js"></script>

<script language="JavaScript" type="text/javascript">
<!--

var localServer = google.gears.factory.create('beta.localserver');
var store = localServer.createStore('test-store');
var whichCap;
/* code to capture this page
captureId=store.capture("http://localhost:8080/testpage/capture.html",ourCallback);
console.debug("capture id for capture page is "+captureId);

captureId=store.capture("http://localhost:8080/images/banga.png",ourCallback);
console.debug("capture id for banga pic is "+captureId);
*/

var manifest;
var currentCard=0;
var currentHint;
var lastHintText;
var cardNamesMostly;
var hintButton;
run(); 

function run()
{
	//this code gets the deck info
	//and captures the card information
	hintButton=document.getElementById("nextHint");
	replayButton=document.getElementById("replayHint");
	answerBox=document.getElementById("answer");
	var req = new XMLHttpRequest();  
	try
	{
 	req.open('GET', 'http://localhost:8080/dm0?joe', false);   
 	req.send(null);  
	}
	catch(e)
	{
		console.debug("offline, we think");
		deckName="test";
		var req4 = new XMLHttpRequest();
		req4.open('GET', 'http://localhost:8080/manifest?'+deckName, false); 
		req4.send(null);  
		console.debug("request for manifest status offline "+req4.status);
 		if(req4.status == 200) 
		{
			manifest=req4.responseText;
		}

		
	}
	console.debug("in run req status <"+req.status+">");
 	if(req.status == 200) 
	{
		console.debug("command: <"+req.responseText+">"); 
		pieces=req.responseText.split(" ");
		deckName=pieces[3];
		console.debug("deckName "+deckName);
		captureId=store.capture("http://localhost:8080/manifest?"+deckName,ourCallback);
		console.debug("capture id for manifest: ",captureId);
		var req2 = new XMLHttpRequest();
		req2.open('GET', 'http://localhost:8080/manifest?'+deckName, false); 
		req2.send(null);  
		console.debug("request for manifest status "+req2.status);
 		if(req2.status == 200) 
		{
			manifest=req2.responseText;
			console.debug("manifest is "+manifest);
			cardNamesMostly=manifest.split("*");
			for (i=1;i<cardNamesMostly.length;i++)
			{
				console.debug("card name in loop: "+cardNamesMostly[i]);
				captureId=store.capture("http://localhost:8080/image?"+cardNamesMostly[i],ourCallback);
				captureId=store.capture("http://localhost:8080/hint1?"+cardNamesMostly[i],ourCallback);
				captureId=store.capture("http://localhost:8080/hint2?"+cardNamesMostly[i],ourCallback);
				captureId=store.capture("http://localhost:8080/hint3?"+cardNamesMostly[i],ourCallback);
			}
		}
	}
nextCard();	
}
function nextCard()
{
	currentCard=currentCard+1;
	currentHint=0;
	hintButton.value="Hint";
	//hide the replay button
	replayButton.style.display="none";
	console.debug("currentCard name: "+cardNamesMostly[currentCard]);
	document.images[0].src="http://localhost:8080/image?"+cardNamesMostly[currentCard];
}
function submitAnswer()
{
	//compare answer to name of card
	//if equal, console.debug correct and go to next card
	if (answerBox.value==cardNamesMostly[currentCard])
	{
		console.debug("Correct");
		nextCard();
	}
	//else console.debug incorrect
	else console.debug("Incorrect");
}



function nextHint()
{
	currentHint=currentHint+1;
	
	if (currentHint==1)
	{
		hintButton.value="Next Hint";
		var req3 = new XMLHttpRequest();
		req3.open('GET', 'http://localhost:8080/hint1?'+cardNamesMostly[currentCard], false);
		req3.send(null);
		lastHintText=req3.responseText;
		console.debug("Hint "+lastHintText);
		//show the replay button
		replayButton.style.display="block";
	}
	else
	if (currentHint==2)
	{
		var req3 = new XMLHttpRequest();
		req3.open('GET', 'http://localhost:8080/hint2?'+cardNamesMostly[currentCard], false);
		req3.send(null);
		lastHintText=req3.responseText;
		console.debug("Hint "+lastHintText);
	}
	else
	{
		var req3 = new XMLHttpRequest();
		//hide the next hint button
		hintButton.style.display="none";
		req3.open('GET', 'http://localhost:8080/hint3?'+cardNamesMostly[currentCard], false);
		req3.send(null);
		lastHintText=req3.responseText;
		console.debug("Hint "+lastHintText);	}
}
function replayHint()
{
	console.debug("Hint "+lastHintText);
}

function ourCallback(url, success, captureId)
{
	console.debug("callback "+captureId);
}
//-->
</script>
<img src="../images/banga.png">
Type your answer here:
<br>
<input type="text" id="answer" value="---------" >
<input type="button" value="Submit Answer" onclick="submitAnswer()">
<input type="button" value="Hint" onclick="nextHint()" id="nextHint">
<input type="button" value="Replay Hint" onclick="replayHint()" id="replayHint">

</body>
</html>
